<!DOCTYPE html>
<html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    <!--<meta http-equiv="X-UA-Compatible" content="IE=edge">-->
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="shortcut icon" href="img/favicon.png">

    <title>Mosaic - Dummy Page</title>

    <!-- Bootstrap core CSS -->
    <link href="css/bootstrap.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link href="css/color-styles.css" rel="stylesheet">
    <link href="css/ui-elements.css" rel="stylesheet">
    <link href="css/custom.css" rel="stylesheet">
    
    <!-- Resources -->
    <link href="css/animate.css" rel="stylesheet">
    <link href="fonts/font-awesome/css/font-awesome.min.css" rel="stylesheet">
    <link href='http://fonts.googleapis.com/css?family=Oswald:400,700,300' rel='stylesheet' type='text/css'>
    <link href='http://fonts.googleapis.com/css?family=Roboto:400,700,500,400italic,500italic,700italic' rel='stylesheet' type='text/css'>

    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
    <![endif]-->
  </head>

  <body class="body-green">

    <!-- Extra Bar -->
    <div class="mini-navbar mini-navbar-dark hidden-xs">
      <div class="container">
        <div class="col-sm-12">
          <a href="#" class="first-child"><i class="fa fa-envelope"></i> Email<span class="hidden-sm">: contact@example.com</span></a>
          <span class="phone">
            <i class="fa fa-phone-square"></i> Tel.: +0 (000) 000-00-00
          </span>
          <a href="sign-up.html" class="pull-right"><i class="fa fa-arrow-circle-down"></i> Sign Up</a>
          <a href="sign-in.html" class="pull-right"><i class="fa fa-sign-in"></i> Sign In</a>
          <a href="#" class="pull-right" id="nav-search"><i class="fa fa-search"></i> Search</a>
          <a href="#" class="pull-right hidden" id="nav-search-close"><i class="fa fa-times"></i></a>
          <!-- Search Form -->
          <form class="pull-right hidden" role="search" id="nav-search-form">
            <div class="input-group">
              <input type="text" class="form-control" placeholder="Search">
              <span class="input-group-btn">
                <button type="submit" class="btn btn-default"><i class="fa fa-search"></i></button>
              </span>
            </div>
          </form>
        </div>
      </div>
    </div>

    <div class="navbar navbar-dark navbar-static-top" role="navigation">
      <div class="container">

        <!-- Navbar Header -->
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="index.html"><i class="fa fa-th-large"></i> The Mosaic <span class="hidden-sm">Business Template</span></a>
        </div> <!-- / Navbar Header -->

        <!-- Navbar Links -->
        <div class="navbar-collapse collapse">
          <ul class="nav navbar-nav navbar-right">
            <li><a href="index.html" class="bg-hover-color">Home</a></li>
            <li class="dropdown active">
              <a href="#" class="dropdown-toggle bg-hover-color" data-toggle="dropdown">Pages <b class="caret"></b></a>
              <ul class="dropdown-menu">
                <li><a href="about-us.html" class="bg-hover-color">About Us</a></li>
                <li><a href="coming-soon.html" class="bg-hover-color">Coming Soon</a></li>
                <li><a href="contact-us.html" class="bg-hover-color">Contact Us</a></li>
                <li><a href="dummy.html" class="bg-hover-color">Dummy Page</a></li>
                <li><a href="help-center.html" class="bg-hover-color">Help Center</a></li>
                <li><a href="help-answer.html" class="bg-hover-color">Help Item</a></li>
                <li><a href="pricing-table.html" class="bg-hover-color">Pricing Table</a></li>
                <li><a href="responsive-video.html" class="bg-hover-color">Responsive Video</a></li>
                <li><a href="services.html" class="bg-hover-color">Services</a></li>
                <li><a href="sign-in.html" class="bg-hover-color">Sign In</a></li>
                <li><a href="sign-in-alt.html" class="bg-hover-color">Sign In Option</a></li>
                <li><a href="sign-up.html" class="bg-hover-color">Sign Up</a></li>
                <li><a href="sign-up-alt.html" class="bg-hover-color">Sign Up Option</a></li>
                <li><a href="404-error.html" class="bg-hover-color">404 Error Page</a></li>
              </ul>
            </li>
            <li class="dropdown">
              <a href="#" class="dropdown-toggle bg-hover-color" data-toggle="dropdown">Portfolio <b class="caret"></b></a>
              <ul class="dropdown-menu">
                <li><a href="portfolio.html" class="bg-hover-color">Portfolio</a></li>
                <li><a href="portfolio-isotope.html" class="bg-hover-color">Portfolio Isotope</a></li>
                <li><a href="portfolio-item.html" class="bg-hover-color">Portfolio Item</a></li>
              </ul>
            </li>
            <li class="dropdown">
              <a href="#" class="dropdown-toggle bg-hover-color" data-toggle="dropdown">Blog <b class="caret"></b></a>
              <ul class="dropdown-menu">
                <li><a href="blog.html" class="bg-hover-color">Blog</a></li>
                <li><a href="blog-post.html" class="bg-hover-color">Blog Post</a></li>
              </ul>
            </li>
            <li class="dropdown">
              <a href="#" class="dropdown-toggle bg-hover-color" data-toggle="dropdown">Shop <b class="caret"></b></a>
              <ul class="dropdown-menu">
                <li><a href="shop.html" class="bg-hover-color">Shop Index</a></li>
                <li><a href="shop-products.html" class="bg-hover-color">Shop Products</a></li>
                <li><a href="shop-item.html" class="bg-hover-color">Shop Item</a></li>
                <li><a href="shop-cart.html" class="bg-hover-color">Shopping Cart</a></li>
                <li><a href="user-profile.html" class="bg-hover-color">User Profile</a></li>
              </ul>
            </li>
            <li class="dropdown">
              <a href="#" class="dropdown-toggle bg-hover-color" data-toggle="dropdown">UI Elements <b class="caret"></b></a>
              <ul class="dropdown-menu">
                <li><a href="ui-elements.html#buttons" class="bg-hover-color">Buttons</a></li>
                <li><a href="ui-elements.html#panels" class="bg-hover-color">Panels</a></li>
                <li><a href="ui-elements.html#info-boards" class="bg-hover-color">Info Boards</a></li>
                <li><a href="ui-elements.html#navs" class="bg-hover-color">Navs</a></li>
                <li><a href="ui-elements.html#headlines" class="bg-hover-color">Headlines</a></li>
              </ul>
            </li>
          </ul>

          <!-- Search Form (xs) -->
          <form class="navbar-form navbar-left visible-xs" role="search">
            <div class="form-group">
              <input type="text" class="form-control" placeholder="Search">
            </div>
            <button type="submit" class="btn btn-default">Go!</button>
          </form> <!-- / Search Form (xs) -->

        </div> <!-- / Navbar Links -->
      </div> <!-- / container -->
    </div> <!-- / navbar -->

    <!-- Wrapper -->
    <div class="wrapper">
    
      <!-- Topic Header -->
      <div class="topic">
        <div class="container">
          <div class="row">
            <div class="col-sm-4">
              <h3 class="primary-font">Page Title</h3>
            </div>
            <div class="col-sm-8">
              <ol class="breadcrumb pull-right hidden-xs">
                <li><a href="index.html">Home</a></li>
                <li class="active">Page Title</li>
              </ol>
            </div>
          </div>
        </div>
      </div>

      <!-- Main Content -->
      <div class="container">
        <div class="row">
          <div class="col-sm-8">
            <h2 class="headline first-child text-color">
              <span class="border-color">Headline #1</span>
            </h2>
            <h3 class="first-child primary-font">Block Title</h3>
            <p>Use this dummy page to create a new page for your website.</p>
            <h3 class="primary-font">Block Title</h3>
            <p>
              Vivamus at tincidunt risus. Etiam nisl velit, commodo et dolor id, volutpat gravida mi. Quisque ligula velit, convallis ac vehicula non, malesuada vel orci. Integer egestas ac eros ut aliquam. Nullam lobortis diam quis ante fringilla, ut consectetur elit mollis. Nullam laoreet magna sit amet orci semper ultrices. Nam a porta nisl. Ut imperdiet a magna sit amet congue. Curabitur quis egestas dui, sit amet consequat lorem. Aenean id accumsan lacus. Aenean vehicula, est vitae suscipit suscipit, lectus elit eleifend ligula, et rutrum odio odio id augue. Phasellus nec eros sodales, congue risus convallis, auctor enim. Donec mollis nibh vitae purus luctus, in scelerisque libero faucibus.
            </p>
            <a class="btn btn-lg btn-color" href="#">Button Large</a>
          </div>
          <div class="col-sm-4">
            <h2 class="headline first-child first-child-m text-color">
              <span class="border-color">Headline #2</span>
            </h2>
            <div class="flex-video">
              <iframe src="//player.vimeo.com/video/67449472" frameborder="0" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen=""></iframe>
            </div>
          </div>
        </div>  <!-- / .row -->
      </div> <!-- / .container -->

    </div> <!-- / .wrapper -->

    <!-- Footer -->
    <footer class="footer-dark">
      <div class="container">
        <div class="row">
          <!-- Contact Us -->
          <div class="col-sm-4">
            <h3 class="text-color"><span class="border-color">Contact Us</span></h3>
            <div class="content">
              <p>
              San Francisco, CA 94101<br />
              1987 Lincoln Street<br />
              Phone: +0 000 000 00 00<br />
              Fax: +0 000 000 00 00<br />
              Email: <a href="#">admin@mysite.com</a>
              </p>
            </div>
          </div>
          <!-- Social icons -->
          <div class="col-sm-4">
            <h3 class="text-color"><span>Go Social</span></h3>
            <div class="content social">
              <p>Stay in touch with us:</p>
              <ul class="list-inline">
                  <li><a href="#" class="twitter"><i class="fa fa-twitter"></i></a></li>
                <li><a href="#" class="facebook"><i class="fa fa-facebook"></i></a></li>
                <li><a href="#" class="pinterest"><i class="fa fa-pinterest"></i></a></li>
                <li><a href="#" class="github"><i class="fa fa-github"></i></a></li>
                <li><a href="#" class="linkedin"><i class="fa fa-linkedin"></i></a></li>
                <li><a href="#" class="vk"><i class="fa fa-vk"></i></a></li>
                <li><a href="#" class="plus"><i class="fa fa-google-plus"></i></a></li>
              </ul>
              <div class="clearfix"></div>
            </div>
          </div>
          <!-- Subscribe -->
          <div class="col-sm-4">
            <h3 class="text-color"><span>Subscribe</span></h3>
            <div class="content">
              <p>Enter your e-mail below to subscribe to our free newsletter.<br />We promise not to bother you often!</p>
              <form class="form" role="form">
                <div class="row">
                  <div class="col-sm-8">
                    <div class="input-group">
                      <label class="sr-only" for="subscribe-email">Email address</label>
                      <input type="email" class="form-control" id="subscribe-email" placeholder="Enter email">
                      <span class="input-group-btn">
                        <button type="submit" class="btn btn-default">OK</button>
                      </span>
                    </div>
                  </div>
                </div>
              </form>
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-sm-12">
            <hr>
          </div>
        </div>
        <!-- Copyrights -->
        <div class="row">
          <div class="col-sm-12">
            <p>&copy; Mosaic 2014. <a href="#">Privacy Policy</a> | <a href="#">Terms of Service</a></p>
          </div>
        </div>
      </div>
    </footer>

    <!-- Style Toggle -->
    <div class="style-toggle text-left hidden-xs">
      <i class="fa fa-gears style-toggle-btn"></i>
      <div class="style-toggle-header text-center">
        Navbar Type
      </div>
      <!-- Navbar Type -->
      <div class="style-toggle-body text-left">
        <div class="radio">
          <label>
            <input type="radio" name="navbar" id="opt-navbar-dark" value="opt-navbar-dark" checked>
            Navbar Dark (default)
          </label>
        </div>
        <div class="radio">
          <label>
            <input type="radio" name="navbar" id="opt-navbar-white" value="opt-navbar-white">
            Navbar White
          </label>
        </div>
        <div class="radio">
          <label>
            <input type="radio" name="navbar" id="opt-navbar-mixed" value="opt-navbar-mixed">
            Navbar Mixed
          </label>
        </div>
      </div>
      <!-- Color Styles-->
      <div class="style-toggle-header text-center">
        Color Styles
      </div>
      <div class="style-toggle-body text-center">
        <ul class="colors list-inline">
          <li class="green"></li>
          <li class="blue"></li>
          <li class="orange"></li>
          <li class="red"></li>
        </ul>
      </div>
      <!-- Footer Type -->
      <div class="style-toggle-header text-center">
        Footer Type
      </div>
      <div class="style-toggle-body text-left">
        <div class="radio">
          <label>
            <input type="radio" name="footer" id="opt-footer-dark" value="opt-footer-dark" checked>
            Footer Dark (default)
          </label>
        </div>
        <div class="radio">
          <label>
            <input type="radio" name="footer" id="opt-footer-white" value="opt-footer-white">
            Footer White
          </label>
        </div>
        <hr>
        <a href="theme-faq.html"><i class="fa fa-question-circle"></i> Using color schemes on a production site.</a>
      </div>
    </div>

    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/scrolltopcontrol.js"></script>
    <script src="js/jquery.sticky.js"></script>
    <script src="js/custom.js"></script>

</body></html>